<template>
  当前登录人 : {{ userName }}

  <el-link type="primary" @click="router.push('/')">退出登录</el-link>
  <div>

    <el-container>
      <el-col :span="5">
        <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo" default-active="2"
          text-color="#fff" router @open="handleOpen" @close="handleClose">
          <el-sub-menu index="1">
            <template #title>
              <el-icon>
                <location />
              </el-icon>
              <span>用户信息</span>
            </template>
            <el-menu-item index="/List">用户信息列表</el-menu-item>
            <el-menu-item index="1-2">item two</el-menu-item>
            <el-menu-item index="1-3">item three</el-menu-item>
          </el-sub-menu>

          <el-sub-menu index="2">
            <template #title>
              <el-icon>
                <icon-menu />
              </el-icon>
              <span>角色管理</span>
            </template>
            <el-menu-item index="/RoleList">角色信息列表</el-menu-item>
          </el-sub-menu>

          <el-sub-menu index="3">
            <template #title>
              <el-icon>
                <icon-menu />
              </el-icon>
              <span>权限管理</span>
            </template>
            <el-menu-item index="/PermisiList">权限信息列表</el-menu-item>
          </el-sub-menu>

          <el-menu-item index="4">
            <el-icon>
              <setting />
            </el-icon>
            <span>会员管理</span>
          </el-menu-item>

        </el-menu>
      </el-col>
      <el-main>
        <router-view />
      </el-main>
    </el-container>
  </div>
</template>

<script setup lang='ts'>
import router from '@/router';
import { useCounterStore } from '@/stores/counter';

const counterStore = useCounterStore();
import {
  Document,
  Menu as IconMenu,
  Location,
  Setting,
} from '@element-plus/icons-vue'

// const userName = sessionStorage.getItem('userName')
const userName = counterStore.userName

const handleOpen = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}
const handleClose = (key: string, keyPath: string[]) => {
  console.log(key, keyPath)
}



</script>

<style></style>
